<template>
	<view >
		<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval"
						:duration="duration">
						<swiper-item v-for="(item,index) in img" :key="index">
							<image class="image" :src="item.src" mode="aspectFit"></image>
						</swiper-item>
						
		</swiper>
		<view class="text-area">
			<text class="title">热销商品</text>
		</view>
		<scroll-view>
			<view class="imageSize">
				<image src="../../static/image/yinliao1.jpg" mode="aspectFit"></image>
			</view>
			<view class="imageSize">
				<image src="../../static/image/yinliao2.jpg" mode="aspectFit"></image>
			</view>
		</scroll-view>
	</view>
	
</template>
	
<script>
	export default {
		 data() {
		        return {
		            indicatorDots: true,
		            autoplay: true,
		            interval: 2000,
		            duration: 1000,
					img: [{
						src: '../../static/image/yinliao3.jpg'
					},
					{
						src: '../../static/image/yinliao4.jpg'
					},
					{
						src: '../../static/image/yinliao6.jpg'
					},
					{
						src: '../../static/image/s1.jpg'
					}]
		        }
		    },
		methods: {
		    }
	}
</script>

<style>
	.title{
		font-size: 36rpx;
		color: #8f8f94;
		text-align: center;
	}
	.text-area{
		display: flex;
		justify-content: center;
	}
		.swiper {
			height: 500rpx;
			width: 100%;
		}
		.image{
			height: 97%;
			width: 100%;
		}
		.imageSize{
			display: flex;
			justify-content: center;
			align-items: center;
		}
		
</style>
